<template>
    <!-- 班级管理 全部信息 -->
    <div>
        <el-button type="primary" @click="allinfoback" class="backbtn">返回</el-button>
        <div class="schart-box">
            <schart class="schart" canvasId="pie" :options="options1"></schart>
        </div>
        <div class="schart-box">
            <schart class="schart" canvasId="ring" :options="options2"></schart>
        </div>
    </div>
</template>

<script>
import Schart from 'vue-schart';
export default {
    components: {
        Schart
    },
    props: ['options1', 'options2'],
    name: 'classallinfo',
    data() {
        return {};
    },
    methods: {
        // 发射监听事件
        allinfoback() {
            this.$emit('allinfoback');
        }
    }
    // watch: {
    //     test(newValue, oldVlue) {
    //         console.log(newValue);
    //         console.log(oldVlue);
    //         console.log("xxx");
    //     }
    // }
};
</script>

<style scoped>
.backbtn {
    float: right;
    /* left: 100%; */
    /* transform: translateX(-100%); */
    margin-bottom: 1rem;
}
.schart-box {
    display: inline-block;
    margin: 20px;
}
.schart {
    width: 500px;
    height: 300px;
}
</style>